在JS中,我們可以藉由運算式得到所需要的值。
所謂的運算式,不是只有像數學的四則運算,它也有其他的形式表現,讓我們求值。
算數運算式就是數學的 + - * / 運算,在執行過程中,如果需要,JS會自動把運算元轉成數值或字串。
如果有任一運算元無法轉成數值,運算結果會以NaN表示。
console.log(1 + 1); //2
console.log('1' + 1); //11
console.log(undefined + 1); //NaN
+運算子可執行數值相加與字串串接
console.log(1 + 1); //2
console.log('A' + 'B'); //AB
console.log('1' + 1); //11
console.log(true + 1); //2
如果運算元中有字串,字串串接的優先權會大於數值相加,所以其他的運算元會轉成字串做串接。
+運算子的執行過程如下:
+運算子可以讓單一值轉型成數值:
let x='1';
console.log(typeof(x)); //string
console.log(typeof(+x)); //number
使用遞增運算式的運算元必須是變數,該運算式會將變數的值轉成數值(若非數值的話)後加1,再將運算結果丟回原變數中。
++運算子可以放在運算元的前與後,雖然都會讓運算元遞增,但執行過程有所差異:
let i = 1;
console.log(++i); //2,先遞增,再執行console.log
i = 1;
console.log(i++); //1,先執行console.log,再遞增
let i = 1;
let j = ++i;
console.log(j); //2,先執行++i,再將遞增的值給j
let i = 1;
let j = i++;
console.log(j); //1,先把i的值給j,再執行遞增
x=x+1執行數值運算的結果等同於x++,但x++不會處理string串接,它只接受數值相加,若x為字串1,x=x+1的結果會是’11’,x++的結果會是2。
console.log(3 > 1); //true
console.log('3' > '1'); //true
console.log(3 > '1'); //true
console.log("three" > 1); //false
檢驗物件是否有指定的屬性名稱,或陣列是否有指定的索引值,若有,回傳true;若無,回傳false。
let obj = {
x: 1,
y: 2
};
console.log('x' in obj); //true
console.log('y' in obj); //true
console.log('z' in obj); //false
let ary = ['a', 'b', 'c'];
console.log(1 in ary); //true
console.log(5 in ary); //false
!運算子具有反向的意思,它會把先把運算元轉成boolean值,再反轉,true轉false或false轉true。
!!運算子除了執行剛剛的步驟之外,還會再反轉一次,變成等效的boolean值,所以如果我們要將某個值轉成boolean值的話,可以使用!!運算子。
以數學的觀念來看,x=5,就是x等於5的意思,但在這邊,不能這樣解讀,必須要說,把5這個值指定給x變數,而且它的結合律是從右到左。
let obj = {};
obj.x = 1;
let ary = [];
ory[0] = 1;
我們也可以用在物件和陣列的給值,設定物件的屬性值與陣列的元素。
let y = null;
let x = y ? y : 'hello'; //若y為有效值,回傳y,否則回傳hello
在?左邊判斷的結果必須為boolean值,若為true,回傳:左邊的值(y);若為false,回傳:右邊的值('hello')。
雖然也可以使用if判斷式來達成相同的目的,但相較之下,採用條件運算式(?:)會來的簡潔許多。
typeof運算子可以用來判斷運算元的型別,回傳型別是string。
console.log(typeof 1); //number
console.log(typeof 'ABC'); //string
console.log(typeof null); //object
console.log(typeof undefined); //undefined
console.log(typeof true); //boolean
console.log(typeof {}); //object
console.log(typeof [1, 2, 3]); //object
console.log(typeof function f() {}); //function
需要注意的是null的型別是object,如果我們需要區分null與object必須用明確的方式:
function isObjet(v) {
return (v !== null && (typeof v == 'object' || typeof v == 'function'))
}
console.log(isObjet(123)); //false
console.log(isObjet(null)); //false
console.log(isObjet({})); //true
運算子的優先運算權
優先權 | 運算子 |
---|---|
高 | 括號( ) |
遞增(++)、遞減(--)、反轉boolean(!) | |
算術 ( * 、/、%) | |
算術(+、-) | |
關係比較(>、>=、<、<=) | |
相等性(==、!=、===、!==) | |
AND(&&) | |
OR(||) | |
條件運算(?:) | |
低 | 指派(=)、運算後指派( * =、-=、+=、/=) |
運算子的結合方向
方向 | 運算子 |
---|---|
左>>右 | 算術 ( * 、/、%) |
左>>右 | 比較(>、>=、<、<=、==、!=、===、!==) |
左>>右 | 邏輯(&&、||) |
右>>左 | 算數 (++、--) |
右>>左 | 指派(=、+=、 * =、/=、-= ) |
右>>左 | 反向邏輯(!) |
右>>左 | 條件運算(?:) |
參考來源:
JavaScript大全
Speaking JavaScript|簡明完整的 JS 精要指南
新一代 JavaScript 程式設計精解